import Vue from 'vue'

import 'normalize.css/normalize.css' // A modern alternative to CSS resets
import Element from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css'

import VueAwesomeSwiper from 'vue-awesome-swiper'
import 'swiper/dist/css/swiper.css'

import '@/styles/index.scss' // global css
import App from './App'
import router from './router'
import store from './store/index'

import i18n from './lang' // Internationalization
// import './permission'
// 全局注册echarts、jsonp
// import echarts from 'echarts'
import * as echarts from 'echarts'
import axios from 'axios'
import mixin from './utils/mixin'

import SocketService from './utils/socket_service'

import highcharts from 'highcharts'
// import VueHighCharts from 'vue-highcharts'
import highcharts3d from 'highcharts/highcharts-3d'
Vue.mixin(mixin)
Vue.use(Element, {
  size: 'small',
  i18n: (key, value) => i18n.t(key, value)
})
import JsonExcel from 'vue-json-excel'
Vue.component('downloadExcel', JsonExcel)
import BaiduMap from 'vue-baidu-map'
import BmScale from 'vue-baidu-map/components/controls/Scale' // 比例尺组件
import BmNavigation from 'vue-baidu-map/components/controls/Navigation' // 缩放组件
import BmMarker from 'vue-baidu-map/components/overlays/Marker' // 标记点的组件
Vue.use(BaiduMap, BmScale, BmNavigation, BmMarker, {
  ak: 'xptpNezWRpod4BdvMcubrLGzhpHfhqqG'
})

Vue.directive('loadmore', {
  bind(el, binding) {
    const selectWrap = el.querySelector('.el-table__body-wrapper')
    selectWrap.addEventListener('scroll', function() {
      let sign = 100
      const scrollDistance = this.scrollHeight - this.scrollTop - this.clientHeight
      if (scrollDistance <= sign) {
        binding.value()
      }
    })
  }
})
Vue.use(VueAwesomeSwiper)
// 对服务端进行websocket的连接
SocketService.Instance.connect()
Vue.prototype.$socket = SocketService.Instance
Vue.prototype.$http = axios
router
Vue.mixin(mixin)
Vue.prototype.$echarts = echarts
highcharts3d(highcharts)
Vue.config.productionTip = false

new Vue({
  el: '#app',
  store,
  router,
  i18n,
  template: '<App/>',
  components: {
    App
  }
})
